<template>
  <div>
    <div class="home">
      <button @click="fn">微信登录</button>
      <p class="huo">或</p>
      <p class="router">
        <router-link to="">账号登陆</router-link>
        |
        <router-link to="">直接试用</router-link>
      </p>
      <van-checkbox v-model="checked" class="yi">已阅读并同意用户协议&隐私声明</van-checkbox>
    </div>
  </div>
</template>
<script>
import { Toast } from "vant";
export default {
  name: "homepage",
  data() {
    return {
      checked: false,
    };
  },
  methods: {
    fn() {
      //   this.$router.push("")
      // Toast('请先阅读并同意协议');
      //  Notify('通知内容');
      // console.log("wo")
      if (!this.checked) {
        Toast("请先阅读并同意协议");
      } else {
        this.$router.push('/reading');
        // alert("输入地址");
      }
    },
  },
};
</script>
<style scoped lang="less">
/deep/ .van-radio__label {
  color: #ccc;
}
.yi{
  margin-left: 1.8rem;
  font-size: 9px;
  margin-top: -0.7rem;
}
.router {
  width: 5rem;
  height: 2rem;
  display: flex;
  justify-content: space-around;
  margin-left: 1.5rem;
  font-size: 9px;
  margin-top: 0.7rem;
}
a {
  color: blue;
  font-size: 9px;
}
.huo {
  /* position: absolute;
    top: 32rem;
    left: 11rem; */
  margin-top: 0.2rem;
  margin-left: 3.9rem;
  color: #ccc;
  font-size: 9px;
}
.home {
  width: 100%;
  height: 13.5rem;
  background: url(../assets/wen-1.jpg) no-repeat;
  background-size: 100% 100%;
}
button {
  width: 5rem;
  height: 0.7rem;
  /* position: absolute;
    top: 30rem;
    left: 2rem; */
  margin-top: 9rem;
  margin-left: 1.5rem;
  background: blue;
  color: #fff;
  border-radius: 10px;
  font-size: 10px;
}
</style>